#toolsSelect {
  @include flexbox();
  @include flex-direction(column);
  height: 100%;
  background: #fff;

  header {
    @include flexbox();
    height: 45px;
    line-height: 45px;
    color: #fff;
    background: linear-gradient(to right, #2fd4ac, #2fd492);

    i {
      width: 30px;
      background: url(image/icon_return.png) no-repeat center;
      background-size: 100%;
    }

    div {
      @include flex();
      font-size: 18px;
      padding-right: 30px;
      text-align: center;
    }
  }



  .el-icon-arrow-down:before {
    content: ""
  }

  section {
    @include flex();
    @include flexbox();
    width: 100%;

    ul.left {
      width: 90px;
      background: #f6f6f6;

      li {
        height: 55px;
        line-height: 55px;
        font-size: 16px;
        color: rgb(51, 51, 51);
        text-align: center;

        &.active {
          background: #fff;
          border-left: 2.5px solid rgb(229, 50, 45);
        }
      }
    }

    ul.right {
      @include flex();
      overflow-y: scroll;
      padding: 0px 10px;

      li {
        padding: 20px 0;
        border-bottom: 1px solid #e5e5e5;

        a {
          @include flexbox();

          &>img {
            border: 1px solid rgba(223, 223, 223, 1);
          }

          &>div {
            @include flex();
            padding: 0 15px 0 5px;

            h3 {
              font-size: 16px;
              font-weight: normal;
              color: rgb(51, 51, 51);
              overflow: hidden;
              text-overflow: ellipsis;
              display: -webkit-box;
              -webkit-box-orient: vertical;
              -webkit-line-clamp: 2;
            }

            &>div {
              @include flexbox();
              padding-top: 16px;

              span {
                @include flex();
                font-size: 17px;
                color: #fdd71a;
                font-family: 'Helvetica Neue';
                padding-left: 14px;
                background: url(image/icon_yuan.png) no-repeat left center;
                background-size: 12px;
              }

              div {
                img {}
              }
            }
          }
        }
      }
    }
  }

  .marks {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 99;
    background: rgba(0, 0, 0, .5);

    div.allTime {
      @include flexbox();
      @include flex-direction(column);
      position: fixed;
      left: 50%;
      top: 40%;
      transform: translate(-50%, -50%);
      width: 80%;
      height: auto;
      border-radius: 8px;
      max-height: 3.1rem;
      overflow: auto;
      background: #fff;
      padding: 30px 15px;

      a {
        width: 80px;
        display: inline-block;
        height: 30px;
        line-height: 30px;
        text-align: center;
        color: #fff;
        background: rgba(229, 50, 45, 1);
        border-radius: 20px;
        margin: 10px auto;
      }

      ul.ltip {
        width: auto;
        margin-left: 10px;
        // margin-top: 25px;
        padding-bottom: 15px;

        li {
          display: block;
        //   height: 0.3rem;
          line-height: 0.3rem;
          border-bottom: 1px solid #e5e5e5;

          .sc-goods-list-one {
            width: 100%;

          }

          .sc-normal {
            width: 0.15rem;
            height: 0.15rem;
            float: left;
            background: url(image/check_normal.png) no-repeat;
            background-size: 0.15rem 0.15rem;
            margin-top: 0.60rem;
          }

          .sc-goods-label {
            display: flex;
            width: 100%;
            position: relative;
            justify-content: space-between;

            >div {
              display: flex;
              align-items: center;
            }
          }

          .sc-goods-checkbox {
            position: absolute;
            left: 0;
            top: 0;
            opacity: 0;
          }

          .sc-goods-checkbox:checked+span {
            background: url(image/check_click.png) no-repeat left center;
            background-size: 0.15rem 0.15rem;
          }

          .sc-goods-cover {
            float: left;
            height: 1.1rem;
            width: 0.86rem;
            border: 1px solid rgb(223, 223, 223);
            margin-top: 0.19rem;
            margin-left: 0.12rem;
          }

          .sc-goods-cover img {
            display: block;
            width: 100%;
            height: 100%;
          }

          .sc-goods-name {
            float: left;
            width: 1.65rem;
            margin: 0.21rem 0.15rem 0 0.1rem;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            font-size: 0.16rem;
            line-height: 0.21rem;
            color: rgb(51, 51, 51);
          }

          .sc-goods-color {
            width: 1.65rem;
            float: left;
            height: 0.25rem;
            line-height: 0.25rem;
            font-size: 0.13rem;
            color: rgb(156, 156, 156);
            margin: 0 0.15rem 0 0.1rem;
          }

          .sc-goods-price-number {
            width: 1.65rem;
            float: left;
            margin: 0.18rem 0.15rem 0 0.1rem;
          }

          .sc-goods-price {
            padding-left: 0.18rem;
            float: left;
            font-size: 0.17rem;
            display: block;
            background: url(image/icon_yuan.png) no-repeat left center;
            background-size: 0.11rem 0.11rem;
            color: rgb(229, 50, 45);
            font-family: "helvetica";
          }

          .sc-goods-number {
            float: right;
            font-size: 0.15rem;
            color: rgb(156, 156, 156);
          }

          .sc-goods-list {
            @include flex();
            width: 100%;
            overflow-y: scroll;

          }

          &:last-child {
            border: none;
          }
        }

      }
    }
  }

  footer {
    @include flexbox();
    height: 50px;
    line-height: 50px;
    border-top: 1px solid #e5e5e5;

    .cart {
      padding: 0px 15px 30px;
      position: relative;

      i {
        position: absolute;
        top: 5px;
        right: 4px;
        width: 18px;
        height: 18px;
        text-align: center;
        line-height: 18px;
        background: #e5322d;
        font-size: 11px;
        border-radius: 50%;
        color: #fff;



      }
    }

    .allPrice {
      @include flex();
      text-align: right;
      padding-right: 15px;

      span {
        font-size: 15px;
        color: rgb(156, 156, 156);
      }

      i {
        font-size: 19px;
        color: #fdd71a;
        font-family: 'Helvetica Neue';
        padding-left: 14px;
        background: url(image/icon_yuan.png) no-repeat left center;
        background-size: 12px;
      }
    }

    a {
      width: 135px;
      background: linear-gradient(to bottom, #2fd4ac, #2fd492);
      font-size: 17px;
      color: #fff;
      text-align: center;
    }
  }
}
